import 'package:flutter/material.dart';

class FFWeb extends StatefulWidget {
  FFWeb({super.key});

  @override
  State<FFWeb> createState() => FFWebState();
}

class FFWebState extends State<FFWeb> {
  /**
   * 是否有背景层
   */
  bool ffHasBgWidget = false;

  /**
   * 是否有背景层2,介于背景层与内容层之间
   */
  bool ffHasBgWidget2 = false;

  /**
   * 是否有悬浮层
   */
  bool ffHasFloatWidget = false;

  /**
   * 是否有顶部悬浮
   */
  bool ffHasNaviFloat = false;

  /**
   * 是否有底部悬浮
   */
  bool ffHasBottomFloat = false;

  /**
   * 是否有顶部悬浮层
   */
  bool ffHasTopFloatWidget = false;

  EdgeInsetsGeometry? ffMargin;
  EdgeInsetsGeometry? ffPadding;

  @override
  void initState() {
    super.initState();

    // 添加在第一帧结束后的回调
    WidgetsBinding.instance.addPostFrameCallback((_) {
      ffFirstFrame();
    });

    // 子类初始化
    ffInitState();
  }

  @override
  void dispose() {
    // 子类销毁
    ffDispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ClipRect(
        child: Stack(
          children: [
            Container(),
            // 最里面的背景层
            if (ffHasBgWidget == true) ffBgWidget(context) ?? Container(),
            // 里面的背景层
            if (ffHasBgWidget2 == true) ffBgWidget2(context) ?? Container(),
            // 内容层
            Container(
              margin: ffMargin,
              padding: ffPadding,
              child: _mainColumn(),
            ),
            // 悬浮1层
            if (ffHasFloatWidget == true) ffloatWidget(context) ?? Container(),
            // 顶部悬浮
            if (ffHasNaviFloat == true)
              Positioned(
                left: 0,
                top: 0,
                right: 0,
                child: ffNaviFloat(context) ?? Container(),
              ),
            // 底部悬浮
            if (ffHasBottomFloat == true)
              Positioned(
                left: 0,
                right: 0,
                bottom: 0,
                child: ffBottomFloat(context) ?? Container(),
              ),

            // 最上面的悬浮层
            if (ffHasTopFloatWidget == true) ffTopFloatWidget(context) ?? Container(),
          ],
        ),
      ),
    );
  }

  Column _mainColumn() {
    return Column(
      children: [
        ffNavi(context) ?? Container(),
        ffNaviBottomFixedArea(context) ?? Container(),
        Expanded(child: ffBody(context) ?? Container()),
        ffBottom(context) ?? Container(),
      ],
    );
  }

  // 子类初始化
  void ffInitState() {}

  // 子类销毁
  void ffDispose() {}

  // 导航栏
  Widget? ffNavi(BuildContext context) {}

  // 导航栏下 固定区域
  Widget? ffNaviBottomFixedArea(BuildContext context) {}

  Widget? ffBody(BuildContext context) {}

  // 底部
  Widget? ffBottom(BuildContext context) {}

  ///背景层:ffHasBgWidget=true才有效
  Widget? ffBgWidget(BuildContext context) {
    return null;
  }

  ///背景层与内容层之间的层:ffHasBgWidget2=true才有效
  Widget? ffBgWidget2(BuildContext context) {
    return null;
  }

  ///悬浮层,ffHasFloatWidget=true才有效
  Widget? ffloatWidget(BuildContext context) {
    return null;
  }

  ///顶部悬浮,ffHasNaviFloat=true才有效
  Widget? ffNaviFloat(BuildContext context) {
    return null;
  }

  ///底部悬浮,ffHasBottomFloat=true才有效
  Widget? ffBottomFloat(BuildContext context) {
    return null;
  }

  ///top悬浮,ffHasTopFloatWidget=true才有效
  Widget? ffTopFloatWidget(BuildContext context) {
    return null;
  }

  // 第一帧结束后执行
  void ffFirstFrame() {}
}

class FFWebStyle {
  Color? backgroundColor;

  FFWebStyle({
    this.backgroundColor,
  });
}
